import React,{useState} from 'react';

const APP = () => {
   const [Txt, setTxt] = useState('');
   const [List, setList] = useState(['学习','看书']);
   let [count, setcount] = useState(0);
    return (
        <div>
           <h1>todoList</h1>
           <h3>当前的数据{count}</h3>
            <input type="text" value={Txt} onChange={(e) => {
                setTxt(e.target.value)
            }}/>
            <button onClick={e => {
                setList([...List,Txt])
                setTxt('')
                count++
                setcount(count)
            }}>添加代办事项</button>
            <ul>
                {
                    List.map((e,ind) => {
                        return <li key={ind}>{e} <button onClick={e => {
                            let newList = [...List]
                            newList.splice(ind,1)
                            console.log(newList);
                            setList(newList)
                        }}>删除</button> </li>
                    })
                }
            </ul>
        </div>
    );
}

export default APP;
